<template>
  <div class="prcList">
    <Loading v-if="loading"></Loading>
    <div class="info" v-else>
        <table class="listInfo" v-if="!showStart">
            <thead>
              <tr>
                <td>ID</td>
                <td>名称</td>
                <td>超级管理员</td>
                <td>操作</td>
              </tr>
            </thead>
            <tbody>
              <tr v-for="(item,index) in tableData">
                <td>{{item.user_id}}</td>
                <td>{{item.admin_name}}</td>
                <td>
                  {{item.is_super|filterType}}
                </td>
                <td>
                  <a @click="getMore(item)">编辑</a>
                  <a @click="getDelete(item)">删除</a>
                </td>
              </tr> 
            </tbody>
        </table>
        <div class="itemInfo" v-if="showStart">
            <div class="formBox">
                <p class="item"><span class="name">用户名称 ：</span><input v-model="date.admin_name" class="slong" placeholder="请输入内容"></input></p>
                <p class="item inputBox"><button @click="submit" class="submitInput">确定</button><button @click="empty" class="emptyInput">返回</button></p>
            </div>
        </div> 
    </div>
    
  </div>
</template>
<script>
import Vue from 'vue'
import Loading from '@/components/loading'
import { Get, Post,Put,Delete } from '@/config/api'
import axios from 'axios'
export default {
  name: 'prcList',
  data() {
    return {
      loading:false,
      tableData: [],
      tableNum:20,//每页显示多少条
      tableCont:0,//一共有多少条信息
      tablePage:1,//当前页码
      showStart:false,//修改窗口
      type:[],
      date:{
          user_id:'',
          admin_name:''
        }
    }
  },
  filters: {  
    filterType: function (value) {  
      if(value==1){
        return '是'
      }else{
        return '否'
      }
      
    }  
  },
  mounted(){
    this.getData()
  },
  components:{
    Loading
  },
  methods:{
    //获取数据
    async getData(e){
      if(this.Check()){
        let reg=await Get('/admin',this.$store.state.token)
        console.log(reg)
        this.tableData=reg.data
        this.loading=false
      } 
    },
    //修改信息
    async getMore(e){
      if(this.Check()){
        let reg=await Get('/admin/'+e.id,this.$store.state.token)
        this.showStart=true
        console.log(reg)
        this.date=reg.data
      }
    },
    //提交修改信息
    submit() {
      let data={
          "admin_name":this.date.admin_name
      }
      let reg=Put('/admin/'+this.date.user_id,this.$store.state.token,data)
      alert('修改成功')
      this.showStart=false
      this.getData()
    },
    //删除管理员
    async getDelete(e){
      if(this.Check()){
        let reg=await Delete('/admin/'+e.id,this.$store.state.token)
        alert('删除成功!')
        this.getData()
      }
    },
    //取消
    empty(){
      this.showStart=false
    }
  }
}

</script>

